<template>
    <div class="gaofen_container">
        <!--<remote-js></remote-js>-->
        <el-table
                ref="gfTable"
                :data="gaofenArr"
                style="height: 100%;background: transparent;"
                height="100%">
            <!--<el-table-column-->
            <!--prop="xh"-->
            <!--label="序号"-->
            <!--&gt;-->
            <!--</el-table-column>-->


            <el-table-column
                    prop="mc"
                    label="名称"
            >
            </el-table-column>

            <el-table-column
                    prop="lx"
                    label="类别"
                    width="100"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.lx==1?"点":scope.row.lx==2?"线":"面"}}</span>
                </template>
            </el-table-column>

            <el-table-column
                    prop="zt"
                    label="状态"
            >
                <template slot-scope="scope">
                    <el-tag size="mini" :type="scope.row.zt==0?'success':scope.row.zt==1?'info':'danger'">
                        {{scope.row.zt==0?'已更新':scope.row.zt==1?'已忽略':'未处理'}}
                        <!--{{scope.row.zt==0?'未推送':'已推送'}}-->
                    </el-tag>
                </template>
            </el-table-column>

            <el-table-column
                    prop="bs"
                    label="标识"
                    width="100"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.bs==1?"我方":"敌方"}}</span>
                </template>
            </el-table-column>


            <el-table-column
                    prop="smname"
                    label="图层"
            >
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    width="120"
            >
                <template slot-scope="scope">
                    <el-button
                            @click.native.prevent="deleteRow(scope.$index)"
                            style="margin-right: 15px;"
                            v-if="scope.row.zt != 0"
                            type="text"
                            size="small">
                        删除
                    </el-button>

                    <el-button
                            @click.native.prevent="pushRow(scope.$index)"
                            type="text"
                            size="small"
                            v-if="scope.row.zt != 0"
                            style="margin-left: 0;">
                        推送
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--<div class="btn_add">-->
        <!--<el-button type="primary" icon="el-icon-plus" circle></el-button>-->
        <!--</div>-->
    </div>
</template>

<script>
    // import {getGaofenData, deleteGaofenItem, sendMessage} from '@/request/api.js'

    export default {
        data() {
            return {
                gaofenArr: [],
                // src3:require('../../../public/js/jss/remotejs2'),
            }
        },
        created(){
           // this.removejscssfile('remotejs.js',"js");


        },
        mounted() {
            // location.reload();

            this.getData();
            let tableDom = this.$refs.gfTable;
            tableDom.bodyWrapper.addEventListener('scroll', e => {
                // console.log('scrollTop:'+e.target.scrollTop);
                // console.log('clientHeight:'+e.target.clientHeight);
                // console.log('scrollHeight:'+e.target.scrollHeight);
            })
            tableDom.bodyWrapper.addEventListener('touchmove', () => {
                console.log(1111)
            });
        },
        created(){

        },
        methods: {
            getData() {
                let data = {
                    limit: "30",
                    offset: "",
                    search: sessionStorage.getItem('bdid'),
                };

                let res = $App.findAllGaofen();
                this.gaofenArr = JSON.parse(res);
                // getGaofenData(data).then(res => {
                //     console.log(res);
                //     if (res.code == 0) {
                //         this.gaofenArr = res.data.rows;
                //     }
                // }).catch(e => {
                //     console.log(e)
                // })
            },
            deleteRow(index) {
                // console.log(this.gaofenArr)
                // let tmpData = {
                //     params: {
                //         xh: this.gaofenArr[index].xh
                //     }
                // }

                let res = $App.delGaofenById(this.gaofenArr[index].id);
                debugger
                if(res == 1){
                    this.$message({
                        message: '删除成功',
                        type: 'success'
                    });

                    this.gaofenArr.splice(index, 1);

                }else {
                    this.$message({
                        message: '删除失败',
                        type: 'error'
                    });
                }
                // deleteGaofenItem(tmpData).then(res => {
                //     if (res.code == 0) {
                //         this.gaofenArr.splice(index, 1);
                //         this.$message({
                //             message: '删除成功',
                //             type: 'success'
                //         });
                //     }
                // }).catch(e => {
                //     this.$message({
                //         message: '删除失败',
                //         type: 'error'
                //     });
                // })
            },
            pushRow(index) {
                //添加一条短报文
                //将nr和nrlx填充至dbw 调用、dbw/send   返回xh
                let data = {
                    "fsbdid": this.$systemMes.loginId,
                    "fsztmc": this.$systemMes.loginName,
                    "jsbdid": this.$systemMes.receiveId,//空标识平台
                    "jsztmc": this.$systemMes.receiveName,
                    "nr": this.gaofenArr[index].xh,
                    "nrlx": 1,//0 短报文信息 1 高分数据 2 任务数据（导航）
                }
                console.log(data);
                // sendMessage(data).then(res => {
                //     this.$message({
                //         type: 'success',
                //         message: '高分数据推送成功'
                //     });
                // }).catch(e => {
                //     console.log("发送失败")
                // });

                //向后台推送高分数据
                $App.pushGaofen(JSON.stringify(this.gaofenArr[index]));

            },
             removejscssfile(filename,filetype){
        var targetelement=(filetype=="js")? "script" :(filetype=="css")? "link" : "none"
        var targetattr=(filetype=="js")?"src" : (filetype=="css")? "href" :"none"
        var allsuspects=document.getElementsByTagName(targetelement)
        for (var i=allsuspects.length; i>=0;i--){
            if (allsuspects[i] &&allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1)
                allsuspects[i].parentNode.removeChild(allsuspects[i])
        }
    }

    },
        computed: {},
        // components:{
        //     'remote-js':{
        //         render(createElement, context) {
        //
        //             return createElement('script',{attr:{type:'text/javascript',src:this.src3}})
        //         },
        //         props:{
        //             src3:{type:String,require:true}
        //         }
        //     }
        // },
        beforeDestroy() {
        }
    }
</script>

<style scoped>
    .gaofen_container {
        width: 100%;
        /*height: 100%;*/
        /*overflow: auto;*/
        flex: 1;
        background: #f5f5f5;
        padding: 0 10px;
    }

    .btn_add {
        position: fixed;
        right: 10px;
        bottom: 60px;
    }

    /deep/ .el-table th.el-table__cell {
        /*background: #4775ff;*/
        /*background: #0a3165;*/
        color: #333333;
        font-weight: bold;
    }

    /deep/ .el-table tr {
        /*background-color: #0a3165;*/
        /*color: #ced6e0;*/
    }

    /deep/ .el-button--text {
        /*color: #64feff;*/
        color:#666;
    }
    /deep/ .cell>span{
        /*color: white;*/
    }


    /deep/ .cell>button{
        font-weight: bold;
    }

    /deep/ .cell>button:first-child{
        color: #ee4242;
        font-weight: bold;
    }
    /deep/ .cell>button:last-child{
        color: #0d98ed;
        font-weight: bold;
    }

</style>